import type { SogouElements } from '../../../../../../../../types/constants/personalization/sogou'
import { ThemeVarService } from '../../../../../../../../lib/abstract/style/theme_var/service'
import { PAGE_ELEMENTS, SUPPORTED_PLATFORMS } from '../../../../../../../../types/constants'

export class SogouNotFoundWeixinPage {
  elements: SogouElements = PAGE_ELEMENTS[SUPPORTED_PLATFORMS.SO_GOU]
  private static instance: SogouNotFoundWeixinPage
  protected readonly themeVarService: ThemeVarService = ThemeVarService.getInstance()

  /**
   * 获取单例实例
   */
  public static getInstance(): SogouNotFoundWeixinPage {
    if (!SogouNotFoundWeixinPage.instance) {
      SogouNotFoundWeixinPage.instance = new SogouNotFoundWeixinPage()
    }
    return SogouNotFoundWeixinPage.instance
  }

  init(): void {
  }

  getMainStyles(): string {
    return `
/* 顶部菜单 */    
.header-box {
  background-color: var(${this.themeVarService.search.header.background}) !important;
  padding-bottom: 20px !important;
  height: auto !important;
  
  .header {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    width: fit-content !important;
    
    .logo {
      position: fixed !important;
      left: 20px !important;
    }
    
    [name="searchForm"] {
      .suggestion {
        .suglist {
          font-size: ${this.themeVarService.search.default.fontSize} !important;
          
          > li {
            color: var(${this.themeVarService.search.suggestions.text}) !important;
            
            &[history] {
              color: var(${this.themeVarService.search.history.text}) !important;
            }
            
            &:not([history]):has(b) {
              color: var(${this.themeVarService.em.text}) !important;
              
              b {
                color: var(${this.themeVarService.search.suggestions.text}) !important;
                font-weight: 400 !important;
              }
            }
          }
        }
      }
    }
  }
}

/* 主内容 */
#wrapper {
  min-width: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;

  #main {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    
    > div:has(> iframe) {
      display: none !important;
    }
  }
}

#s_footer {
  position: fixed !important;
  bottom: 5px !important;
  width: 100% !important;
}
    `
  }
}
